.root {

  .userInfo {
    cursor: pointer;

    :global {
      .ant-avatar {
        margin-right: 0;
      }
    }
  }

  .content {
  }

  :global {
    .ant-page-header-heading-extra {
      height: 32px;
    }

    @media (max-width: 576px) {
      .ant-page-header-heading-extra {
        height: 36px;
      }
    }
  }
}


.userPopover {
  width: 300px;

  :global {
    .ant-popover-inner-content {
      padding: 0;
    }

    .ant-list-item {
      cursor: pointer;
      padding: 0;

      :local {
        .listItemSecondaryText, {
          font-size: 12px;
          color: var(--mall-store-sub-color);
        }
      }

      a {
        width: 100%;
        height: 100%;
        color: inherit;
        padding: 12px 16px;
        display: flex;
        justify-content: space-between;
        align-items: center;

        .anticon-right {
          margin-left: 4px;
        }

      }

      &:hover {
        color: #fff;
        background: var(--mall-store-primary-color);

        :local {
          .listItemSecondaryText {
            font-size: 12px;
            color: #fff;
            transition: color 0.3s;
          }
        }
      }

      &:first-child, &:last-child {
        background: var(--mall-store-background-color);

        &:hover {
          color: #fff;
          background: var(--mall-store-primary-color);
        }
      }
    }
  }
}
